import React from 'react'
import { InputItem, DatePicker, List, Button } from 'antd-mobile'
import './index.less'
import {getUrlParams} from 'UTIL/commonUtil';
import CommonHeader from 'COMPONENT/CommonHeader';
// ========================================
const Item = List.Item;
const nowTimeStamp = Date.now();
const now = new Date(nowTimeStamp);
// ========================================
class Reservation extends React.Component {
    constructor (props) {
        super(props);
        this.state = {
            title: '',
            type: '',
            date: now,
            phone: '13938384048',
            person: '张三',
            isShow: false
        };
    }
    componentWillMount () {
        let urlParams = getUrlParams();
        // console.log('urlParams:', urlParams, urlParams['ctype']);
        let title = urlParams['title'];
        let type = urlParams['type'];
        this.setState({
            title: title || '修改预约时间',
            type: type
        });
    }
    phoneChangeFun = (val) => {
        this.setState({
            phone: val
        });
    };
    personChangeFun = (val) => {
        this.setState({
            person: val
        });
    };
    btnClickFun = () => {
        let type = this.state.type;
        if (type) { // 修改预约时间
            //
        } else { // 看房预约
            this.setState({
                isShow: true
            });
        }
       	/*this.context.router.push({
	    	pathname: '/RentHouse/HouseDetail'
	    })*/
    };
    render() {
        let that = this;
        return (
            <div id="reservation">
                <CommonHeader
                    name={this.state.title}
                    leftContentTitle="@back"
                />
                <div style={{paddingTop: '45px'}}></div>
                <div>
                    <DatePicker mode="date" value={this.state.date}
                        onChange={(date) => { that.setState({ date: date }); }}>
                        <Item arrow="horizontal">看房时间：</Item>
                    </DatePicker>
                    <InputItem placeholder="联系电话" value={this.state.phone}
                                onChange={this.phoneChangeFun} >
                        联系电话：
                    </InputItem>
                    <InputItem placeholder="联系人" value={this.state.person}
                                onChange={this.personChangeFun}>
                        联系人：
                    </InputItem>
                    {
                        this.state.isShow ?
                            (
                                <div>
                                    <InputItem placeholder="管家" value="李四" editable={false}>
                                        管家：
                                    </InputItem>
                                    <InputItem placeholder="联系电话" value="13908828394" editable={false}>
                                        联系电话：
                                    </InputItem>
                                </div>
                            ) : ''
                    }
                </div>
                <div className="reservation-btnGroup">
                    
                    <div className="btnGroup-one">
					     <Button type="primary" className="btnGroup-one-btn" onClick={this.btnClickFun}>
	                        {this.state.type ? '确认修改' : '确定'}
	                    </Button>
					</div>
                </div>
            </div>
        );
    }
}
// ========================================
export default Reservation;